<% extends 'base.html' %>
<% block title %>产品入库<% endblock %>
<% block body %>
<% block head %>
    <script type="text/javascript" src='http://res.wx.qq.com/open/js/jweixin-1.0.0.js'></script>
<% endblock %>

<div class='page' id='product-stock' ms-controller='product-stock'>
    <header class="bar bar-nav">
        <div class="bar" >
          <div class="searchbar">
            <div class="search-input">
              <label class="icon icon-search" for="search"></label>
              <input type="search" placeholder='请输入关键字...' ms-duplex='search_word' />
              <span id='icon-list-location' ms-click='toggle_location_choose'>库位：{{current_location.name}}</span>
              <ul id='list-location-choose' >
                <li ms-click='choose_location(location)' ms-class='location-choosed:location.id === current_location.id' ms-repeat-location='location_ids'>{{location.name}}</li>
              </ul>
            </div>

          </div>
        </div>
    </header>

    <div class="content" >
        <input name='hidden' id='hidden_location_ids' value='${location_ids}' ms-visible='false' />
        <div class='product-stock-special product-search-sort-bar'>
          <ul>
            <li ms-click="sort('product_name')">
              <div><span ms-class="product-color-black:sort_name != 'product_name'">产品名称</span><span ms-visible="sort_name == 'product_name'" class='icon-arrow' ms-class="icon-arrow-rotate:sort_direction == 'down'"><</span></div>
            </li>
            <li ms-click="sort('product_qty')">
              <div><span ms-class="product-color-black:sort_name != 'product_qty'">当前数量</span><span ms-visible="sort_name == 'product_qty'" class='icon-arrow' ms-class="icon-arrow-rotate:sort_direction == 'down'"><</span></div>
            </li>
            <li ms-click="sort('outgoing_qty')">
              <div><span ms-class="product-color-black:sort_name != 'outgoing_qty'">即将出库</span><span ms-visible="sort_name == 'outgoing_qty'" class='icon-arrow' ms-class="icon-arrow-rotate:sort_direction == 'down'"><</span></div>
            </li>
            <li ms-click="sort('incoming_qty')">
              <div><span ms-class="product-color-black:sort_name != 'incoming_qty'">即将入库</span><span ms-visible="sort_name == 'incoming_qty'" class='icon-arrow' ms-class="icon-arrow-rotate:sort_direction == 'down'"><</span></div>
            </li>
          </ul>
        </div>
        <div>
            <div class="card" ms-repeat-quant='quants' ms-if-loop='quant.visible'>
              <div class="card-content">
                <div class="list-block media-list">
                  <ul>
                    <li class="item-content">
                      <div class="item-media">
                          <img width="80" height="80" ms-attr-src="/website/image/product.product/{{quant.product_id}}/image" />
                      </div>
                      <div class="item-inner product-stock-inner">
                        <div class="item-title-row">
                          <div class="item-title">{{quant.product_name}}</div>
                        </div>
                        <div class="item-subtitle">
                          即将入库：<span style='padding-right:.4rem;color:red'>{{quant.incoming_qty || 0}}{{quant.product_uom_translation || quant.product_uom}}</span>
                          即将出库：<span style='color:red'>{{quant.outgoing_qty || 0}}{{quant.product_uom_translation || quant.product_uom}}</span>
                          <div>
                            当前库位数量：<span style='color:red'>{{quant.product_qty || 0}}{{quant.product_uom_translation || quant.product_uom}}</span>
                          </div>
                        </div>
                      </div>
                    </li>
                  </ul>
                </div>

              </div>

            </div>

            <div class='list-page' ms-class='list-page-bottom:current_length - current_index <= 4' >
              <div class='list-page-info'>{{current_page}} of {{pages}}</div>
              <div>
                <span ms-click='previous_page' class='icon icon-left' ms-class='icon-disable:current_page==1'></span>
                <span ms-click='next_page' class='icon icon-right' ms-class='icon-disable:current_length - current_index <= items_per_page'></span>
              </div>
            </div>

        </div>
    </div>
</div>

<% endblock %>

<% block script %>
    ${ super() }
    <script type="text/javascript" src="/dftg_weixin/static/src/js/product_stock.js"></script>
<% endblock %>
